import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:sleep/comp/heat.dart';
import 'package:sleep/help_style.dart';
import 'package:flutter/material.dart';
import 'package:sleep/provider/wave_deatil_provider/pluse_detail_provider.dart';

class HomeBottom extends ConsumerWidget {
  const HomeBottom({Key? key}) : super(key: key);

  Widget messageItem(String title, String content, String unit, IconData icon,
      Color bgColor, Color iconColor,
      {Widget? iconChild}) {
    return Padding(
      padding:
          const EdgeInsets.only(left: 8.0, top: 12.0, right: 16, bottom: 8.0),
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.start,
        mainAxisAlignment: MainAxisAlignment.start,
        children: [
          RichText(
              text: TextSpan(
            text: content + unit,
            style:
                HelpStyle.titleStyle3.copyWith(color: HelpStyle.primarycolor),
            children: [
              const TextSpan(text: "\n"),
              TextSpan(text: title, style: HelpStyle.smallStyle),
            ],
          )),
          const Expanded(child: SizedBox()),
          Container(
            padding: EdgeInsets.all(8),
            decoration: BoxDecoration(
                color: bgColor, borderRadius: BorderRadius.circular(16)),
            child: iconChild ??
                Icon(
                  icon,
                  color: iconColor,
                ),
          ),
        ],
      ),
    );
  }

  Widget rowIem(_ContentModel right, _ContentModel left) {
    return Row(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Expanded(
            child: messageItem(right.title, right.message, right.unit,
                right.icon, right.bgColor!, right!.iconColor,
                iconChild: right.iconChild)),
        LayoutBuilder(
            builder: (BuildContext context, BoxConstraints constraints) {
          return Container(
            color: HelpStyle.primarycolor,
            width: 0.5,
            height: 60,
          );
        }),
        Expanded(
            child: messageItem(left.title, left.message, left.unit, left.icon,
                left.bgColor!, left.iconColor))
      ],
    );
  }

  @override
  Widget build(BuildContext context, ref) {
    final plue = ref.watch(pulseDetailProvider);
    final hv = _ContentModel(
      'BPM',
      plue.bpm,
      '',
      Icons.show_chart_outlined,
      bgColor: iconColors[2],
      iconChild: HeartbeatAnimation(),
      iconColor: iconColors[3],
    );
    final k = _ContentModel(
      'HRV',
      plue.hrv,
      '',
      Icons.show_chart_outlined,
      bgColor: iconColors[2],
      iconColor: iconColors[1],
    );
    final si = _ContentModel(
      'SI',
      plue.si,
      'm/s',
      Icons.directions_walk,
      bgColor: iconColors[2],
      iconColor: iconColors[3],
    );
    final pwv = _ContentModel(
      'PWV',
      plue.pwv,
      'm/s',
      Icons.self_improvement,
      bgColor: iconColors[2],
      iconColor: iconColors[0],
    );

    return Column(
      children: [
        Container(
          padding: EdgeInsets.fromLTRB(HelpStyle.margin, HelpStyle.margin,
              HelpStyle.margin, HelpStyle.margin),
          decoration: HelpStyle.decoration,
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              rowIem(hv, k),
              Divider(
                height: 1,
                color: HelpStyle.primarycolor,
              ),
              rowIem(si, pwv),
            ],
          ),
        ),
      ],
    );
  }
}

class _ContentModel {
  final String title;
  final String message;
  final String unit;
  final IconData icon;
  final Widget? iconChild;
  final Color? bgColor;
  final Color iconColor;

  _ContentModel(this.title, this.message, this.unit, this.icon,
      {this.iconChild, this.bgColor, required this.iconColor});
}
